<template>
    <view class="bg-[#EAEAEA] min-h-screen">
        <view class="py-[20rpx] mx-[30rpx]  " @click="show = true">
            <u-search disabled bgColor="#fff" class="flex-1" :showAction="false" placeholder="搜索"
                v-model="course"></u-search>

        </view>
        <view class="bg-white pt-[30rpx] pb-[60rpx] px-[30rpx]">
            <view class="flex">姓名：<view class="border-b flex-1 border-[#b1b1b1]"><input type="text"></view>
            </view>
            <view class="flex mt-[30rpx]">账号：<view class="border-b flex-1 border-[#b1b1b1]"><input type="text"></view>
            </view>

            <view class="flex mt-[30rpx] items-center">授权范围：<view class="border-b flex-1 border-[#b1b1b1] flex items-center"><input class="flex-1" type="text"><u-icon name="arrow-down" color="#000" size="18"></u-icon></view>
            </view>
            <view @click="sqshow = true" class="text-[#FD755D] text-center mt-[20rpx]">+添加授权</view>
        </view>

    </view>
    <u-popup :show="show" round="19" @close="show = false">
        <view class="pt-[20rpx] h-[700rpx] w-full  relative">
            <view class="text-center py-[20rpx] text-[34rpx] font-bold">搜索结果</view>
            <view class="text-center">
                <text class="mr-2">张三</text>
                <text>13888888888</text>
            </view>
            <view class="bottom-[50rpx] absolute w-full flex items-center justify-center">
                <view class=" mr-[80rpx] text-[#FD755D] py-[20rpx] px-[50rpx] bg-[#ffd6cf] rounded  text-[32rpx]">取消
                </view>
                <view class=" text-white py-[20rpx] px-[50rpx] bg-[#FD755D] rounded  text-[32rpx]">确定</view>
            </view>

        </view>
    </u-popup>
    <u-popup :show="sqshow" round="19" @close="sqshow = false">
        <view class="pt-[20rpx] h-[700rpx] w-full relative">
            <view  class="text-center py-[20rpx] text-[34rpx] font-bold">添加授权</view>
            <view class="text-center py-[30rpx] mx-[30rpx] border-b border-[#EFEFEF]">
               教学数据统计
            </view>
            <view class="text-center py-[30rpx] mx-[30rpx] border-b border-[#EFEFEF]">
               课程数据管理
            </view>
            <view class="text-center py-[30rpx] mx-[30rpx] border-b border-[#EFEFEF]">
                社区统计
            </view>
            <view class="bottom-[50rpx] absolute w-full  flex items-center justify-center">
                <view class=" mr-[80rpx] text-[#FD755D] py-[20rpx] px-[50rpx] bg-[#ffd6cf] rounded  text-[32rpx]">取消
                </view>
                <view class=" text-white py-[20rpx] px-[50rpx] bg-[#FD755D] rounded  text-[32rpx]">确定</view>
            </view>

        </view>
    </u-popup>
</template>
<script setup>
import { ref } from 'vue'
const show = ref(false)
const sqshow = ref(false)
</script>